<template>
  <view class="icon">
    <uni-icons custom-prefix="iconfont" type="icon-down" :size="fontSize" v-if="isFold"></uni-icons>
    <uni-icons custom-prefix="iconfont" type="icon-up" :size="fontSize" v-else></uni-icons>
  </view>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const props = defineProps({
  defaultFold: {
    type: Boolean,
    default: true
  },
  fontSize: {
    type: String,
    default: '23rpx'
  },
  color: {
    type: String,
    default: '#999'
  }
})

const isFold = ref(props.defaultFold)
function toggle() {
  isFold.value = !isFold.value
}
defineExpose({
  isFold,
  toggle
})
</script>

<style scoped lang="scss">
.icon {
  display: inline-block;
}
</style>
